﻿
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/lib/_LayoutPageLib.cshtml";
}

<div class="x-nav">
    <span class="layui-breadcrumb">
        <a href="">管理员管理</a>
        <a>
            <cite>角色管理</cite>
        </a>
    </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
    </a>
</div>

<div class="layui-card-header">@*添加新的角色*@
    <button class="layui-btn layui-btn-normal" onclick="add()"><i class="layui-icon">&#xe654;</i>添加新的角色</button>
</div>

<script type="text/html" id="del">@*删除按钮*@
    <button class="layui-btn layui-btn-danger" title="删除该角色" lay-event="del">删除</button>
</script>

<script type="text/html" id="updata">@*修改按钮*@    
    <button class="layui-btn layui-btn-normal" title="修改" lay-event="updata">编辑</button>
</script>

<div class="layui-card-body ">@*表单元素*@
    <table id="demo" lay-filter="demoX" class="layui-table layui-form"></table>
</div>

<script>
        var loadCurr = false; //等于0表示重载当前页
        layui.use(['table', 'layer', 'form'], function () {
            $ = layui.jquery;
            var layer = layui.layer, table = layui.table, form = layui.form;
            //第一个实例
            var tableIns = table.render({
                elem: '#demo'
                , height: 500
                , url: '/Roles/Search'
                , page: true//开启分页
                , toolbar: '#toolbarDemo'
                , cols: [[ //表头
                      { field: 'Name', title: '角色名称', width: 400, align: 'center' }                    
                    , { field: 'right', align: 'center', toolbar: '#del', title: '操作', width: 400 }
                    , { field: 'right', align: 'center', toolbar: '#updata', title: '操作', width: 400 }
                ]],
                id: 'testReload',
                done: function (res, curr, count) {
                    loadCurr = false;
                }
            });
            //行内工具栏事件
            table.on('tool(demoX)', function (obj) {
                var data = obj.data;
                //删除角色开始
                if (obj.event === 'del') {
                    layer.confirm('此操作及其危险，确认删除吗？',function (index) {
                        
                    });
                }
                //删除角色结束
                //修改角色开始
                if (obj.event === 'updata') {
                    layer.open({
                        type: 2,
                        title: "修改角色功能",
                        area: ["700px", "500px"],
                        content: "/Roles/Updata?id=" + data.Id,
                        end: function () {
                            window.location.reload();
                        }
                    });                    
                }
                //修改角色结束
            })
        })
</script>
<script>
    function add() {
        layer.open({
            type: 2,
            title: "修改角色功能",
            area: ["700px", "500px"],
            content: "/Roles/Add",
            end: function () {
                window.location.reload();
            }
        });
    }
</script>

